<!--
* description:关键信息修改弹窗
* author: lzhihui
* createdDate: 2019-10-19
-->
<template>
  <section class="editCarBrand">
    <el-dialog
      :close-on-click-modal="false"
      :title="textMap[popupsState]"
      :append-to-body="true"
      :visible.sync="curPopupsVisible"
      @close="close"
      width="1000px"
    >
      <dialogHeader
        slot="title"
        :title="textMap[popupsState]"
        :styleType="$store.state.app.dialogType"
      ></dialogHeader>
    <div class="self-crm-dialogFrame">

      <el-form class="editPer filter-params-crm">
        <div class="filter-container-crm filter-title-crm">{{infoComponents[0].title}}</div>
        <div class="filter-container-crm filter-params-crm">
          <crmGroupForm
            :dynamicComponentss="infoComponents[0].tableComponents"
            :values="formField"
            ref="ref1"
          />
        </div>
        <div class="filter-container-crm filter-title-crm">{{infoComponents[1].title}}</div>
        <div class="filter-container-crm filter-params">
          <crmGroupForm
            :dynamicComponentss="infoComponents[1].tableComponents"
            :values="formField"
          />
          <crmGroupForm
            :dynamicComponentss="infoComponents[2].tableComponents"
            :values="formField"
          />
        </div>
        <div class="filter-container-crm filter-title-crm">{{infoComponents[3].title}}</div>
        <div class="filter-container-crm filter-params">
          <crmGroupForm
            :dynamicComponentss="infoComponents[3].tableComponents"
            :values="newformField"
            ref="liandong"
          />
          <crmGroupForm
            :dynamicComponentss="infoComponents[4].tableComponents"
            :values="newformField"
            ref="ref2"
          />
        </div>
      </el-form>
    </div>
      <div slot="footer" class="dialog-footer">
        <el-button
          v-for="comp in tableButtons"
          :key="comp.compKey"
          :type="comp.type"
          @click="comp.clickEvent"
        >{{comp.text}}</el-button>
      </div>
    </el-dialog>
  </section>
</template>
<script>
import { formMixins } from "@/components/mixins/formMixins";
import OneTableTemplate from "@/components/crm/Template/crmonePage";

import { crmApis } from "@/api/apiList/crm";
import { requestAPI } from "@/api/commonRequest";
import crmGroupForm from "@/components/crm/commonComponents/crmGroupForm";
import crmGroupSubmit from "@/components/crm/commonComponents/crmGroupSubmit";

// import crmTextInput from "@/components/crm/textbox/crmTextInput";

// import lookupvalue from "@/components/crm/lookupValue/lookupvalue";
import UpLoad from "@/components/crm/EjectWindows/UpLoad";
import { log } from "util";

// import edit from "@/views/crm/cu/CustInfo/keyInfo";
export default {
  name: "badPhoneModifiEdit",
  // 组件混入对象
  mixins: [formMixins],
  components: {
    crmGroupForm,
    crmGroupSubmit,
    // crmTextInput,
    // lookupvalue,
    UpLoad, dialogHeader: () => import("@/components/dialogHeader") //弹窗标题
    // edit
  },
  props: {},
  data() {
    return {
      State: "",
      keyInfo: false,
      // 动态组件-按钮
      infoComponents: [
        {
          title: "关键信息修改明细",
          tableComponents: [
            // {
            //   compKey: "compKey1",
            //   labelName: "信息途径",
            //   codeField: "verifywayCode",
            //   lookuptype: "1004",
            //   component: () => import("@/components/crm/lookupValue/lookupvalue"),
            //   isMust: false,
            // },
            {
              compKey: "compKey1",
              labelName: "信息途径",
              codeField: "verifywayCode",
              textField: "verifywayName",
              isRequire: true,
              isMust: false,
              isMul: false,
              lookuptype: crmApis.mdmBaseVerifywayQueryFindAll,
              component: () =>
                import("@/components/crm/lookupValue/singleDropList")
            },
            {
              compKey: "compKey2",
              labelName: "客户名称",
              codeField: "custName",
              component: () => import("@/components/crm/textbox/crmTextInput"),
              // isRequire: true,
              isMust: false,
              type: "inputText",
              disabled: true
            }
          ]
        },
        {
          title: "原信息",
          tableComponents: [
            {
              compKey: "compKey3",
              labelName: "电话",
              codeField: "phone1",
              component: () => import("@/components/crm/textbox/crmTextInput"),
              isMust: false,
              type: "inputText",
              disabled: true
            },
            {
              compKey: "compKey4",
              labelName: "证件类型",
              codeField: "credTypeCode1",
              lookuptype: "DB0037",
              disabled: true,
              component: () =>
                import("@/components/crm/lookupValue/lookupvalue")
            },
            {
              compKey: "compKey5",
              labelName: "证件号码",
              codeField: "credNo1",
              component: () => import("@/components/crm/textbox/crmTextInput"),
              disabled: true,
              type: "inputText"
            }
          ]
        },
        {
          title: "",
          tableComponents: [
            // {
            //   compKey: "compKey6",
            //   labelName: "详细地址",
            //   codeField: "addrStreet1",
            //   component: () => import("@/components/crm/textbox/crmTextInput"),
            //   type: "inputText",
            //   disabled: true
            // },
            {
              compKey: "compKey6",
              labelName: "详细地址",
              codeField: "addrStreet1",
              disabled: true,
              isMust: true,
              component: () => import("@/components/crm/textbox/crmTextInput"),
              span: 12,
              inputType: "textarea"
            }
          ]
        },
        {
          title: "新信息",
          tableComponents: [
            {
              compKey: "compKey7",
              labelName: "电话",
              codeField: "phone",
              component: () => import("@/components/crm/textbox/crmTextInput"),
              isRequire: true,
              validrule: {
                noRequire: false,
                isformat: /^((0\d{2,3}-\d{7,8})|(1(3|4|5|6|7|8|9)\d{9}))$/
              },
              type: "inputText"
            },

            {
              compKey: "compKey10",
              labelName: "省份",
              codeField: "provinceId",
              textField: "provinceName",
              isMust: true,
              isMul: false,
              isRequire: false, //必填
              lookuptype: crmApis.mdmOrgProvinceQueryFindAll,
              changeDropInit: this.changeCityByProvince,
              component: () =>
                import("@/components/crm/lookupValue/singleDropList")
            },
            {
              compKey: "provinceId",
              labelName: "城市",
              codeField: "cityId",
              textField: "cityName",
              isRequire: false,
              isMust: true,
              isMul: false, //是否多选
              lookuptype: crmApis.mdmOrgCityQueryFindAll,
              changeCodeArray: [{ changCode: "provinceId" }],

              component: () =>
                import("@/components/crm/lookupValue/secondDropList")
            },
            // {
            //   compKey: "cityId",
            //   labelName: "区县",
            //   codeField: "countyId",
            //   textField: "countyName",
            //   isMust: true,
            //   isMul: false,
            //   isRequire: true,
            //   lookuptype: crmApis.mdmOrgCommunityQueryFindAll,
            //   changeCodeArray: [{ changCode: "cityId" }],
            //   component: () =>
            //     import("@/components/crm/lookupValue/secondDropList")
            // },
            {
              compKey: "cityId",
              labelName: "区县",
              codeField: "countyId",
              textField: "countyName",
              isRequire: false,
              isMust: true,
              isMul: false,
              disabled: false,
              lookuptype: crmApis.mdmOrgCommunityQueryFindAll,
              changeCodeArray: [{ changCode: "cityId" }],
              component: () =>
                import("@/components/crm/lookupValue/secondDropListInit")
            },
            {
              compKey: "compKey8",
              labelName: "证件类型",
              codeField: "credTypeCode",
              lookuptype: "DB0037",
              isRequire: true,
              component: () =>
                import("@/components/crm/lookupValue/lookupvalue")
            },
            {
              compKey: "compKey9",
              labelName: "证件号码",
              codeField: "credNo",
              isRequire: true,
              component: () => import("@/components/crm/textbox/crmTextInput"),
              type: "inputText"
            }
          ]
        },
        {
          title: "新信息",
          tableComponents: [
            // {
            //   compKey: "compKey13",
            //   labelName: "详细地址",
            //   codeField: "addrStreet",
            //   component: () => import("@/components/crm/textbox/crmTextInput"),
            //   type: "inputText",
            //   isRequire: true
            // },
            {
              compKey: "compKey13",
              labelName: "详细地址",
              codeField: "addrStreet",
              isRequire: true,
              isMust: true,
              component: () => import("@/components/crm/textbox/crmTextInput"),
              span: 12,
              inputType: "textarea"
            }
          ]
        }
      ],
      // 保存API配置对象
      apiConfig: crmApis.createdOneIdMutationUpdateKeyValue,
      tableButtons: [
        {
          compKey: "btnKey3",
          type: "primary",
          size: "small",
          clickEvent: () => this.save(),
          text: "保存"
        }
        // {
        //   compKey: "btnKey1",
        //   type: "",
        //   size: "small",
        //   clickEvent: () => this.sendCode(),
        //   text: "关闭"
        // }
      ],
      // 标题
      textMap: {
        edit: "修改关键信息明细",
        add: "添加关键信息明细"
      },
      params: {
        dlrCustNo: "", //专营店客户编码
        custName: "", //客户名称
        custClassCode: "", //客户类型
        phone: "", //电话
        credTypeCode: "", //证件类型编码
        credNo: "", //证件号码
        addrStreet: "", //详细地址
        provinceId: "", //省份ID
        addrProvince: "", //省份名称
        // credTypeName: "",//证件类型名称
        countyId: "", //区县ID
        addrCounty: "", //区县名
        cityId: "", //城市ID
        addrCity: "", //城市名
        custFullName: "" //客户全称
      },
      // 表单数据（无需赋值，由混入对象赋值）
      formField: {
        vin: "",
        carBrandCode: "",
        addr: "",
        dlrCustNo: "", //专营店客户编码
        verifywayCode: "", //核实途径编码
        // verifywayName:"",//核实途径编码
        // provinceName: "",
        // cityName: "",
        // countyName: "",
        custName: "", //客户名称
        custClassCode: "", //客户类型
        phone1: "", //电话
        credTypeCode1: "", //证件类型编码
        credNo1: "", //证件号码
        addrStreet1: "", //详细地址
        provinceId: "", //省份ID
        addrProvince: "", //省份名称
        custInfo: "",
        // credTypeName: "",//证件类型名称
        countyId: "", //区县ID
        addrCounty: "", //区县名
        cityId: "", //城市ID
        addrCity: "", //城市名
        custFullName: "" //客户全称,
      },
      newformField: {
        dlrCustNo: "", //专营店客户编码
        provinceName: "",
        cityName: "",
        countyName: "",
        custName: "", //客户名称
        custClassCode: "", //客户类型
        phone: "", //电话
        credTypeCode: "", //证件类型编码
        credNo: "", //证件号码
        addrStreet: "", //详细地址
        provinceId: "", //省份ID
        addrProvince: "", //省份名称
        // custInfo: "",
        // credTypeName: "",//证件类型名称
        countyId: "", //区县ID
        addrCounty: "", //区县名
        cityId: "", //城市ID
        addrCity: "", //城市名
        custFullName: "" //客户全称
      }
    };
  },
  mounted() {
    this.$nextTick(() => {
      this.initData();
    });
  },

  methods: {
    initData() {
      if (this.popupsState == "edit") {
        this.formField.dlrCustNo = this.dynamicEditRowData.dlrCustNo;
        this.formField.custClassCode = this.dynamicEditRowData.custClassCode;
        this.formField.custName = this.dynamicEditRowData.custName;
        this.formField.custFullName = this.dynamicEditRowData.custFullName;
        this.formField.phone1 = this.dynamicEditRowData.phone;
        this.formField.credTypeCode1 = this.dynamicEditRowData.credTypeCode;
        this.formField.credNo1 = this.dynamicEditRowData.credNo;
        this.formField.addrStreet1 = this.dynamicEditRowData.addrStreet;
        this.newformField.phone = this.dynamicEditRowData.phone;
        this.newformField.credTypeCode = this.dynamicEditRowData.credTypeCode;
        this.newformField.credNo = this.dynamicEditRowData.credNo;
        this.newformField.provinceId = this.dynamicEditRowData.provinceId;
        this.newformField.cityId = this.dynamicEditRowData.cityId;
        this.newformField.countyId = this.dynamicEditRowData.countyId;
        this.newformField.addrStreet = this.dynamicEditRowData.addrStreet;
        let that = this;
        setTimeout(function() {
          that.$refs.liandong.getDropValue(
            that.newformField.cityId,
            "",
            "cityId"
          );
        }, 500);
      }
    },
    save() {
      // validpopup  弹窗  validpage 页面
      let that = this;
      that.$utils.validataMoth(that, "crmpage",'','ref2');
      that.$utils.validataMoth(that, "crmpage",'','liandong');
      that.$utils.validataMoth(that, "crmpage",'','ref1');
      debugger
      var sfData=this.$refs.liandong.$refs.compKey10[0].optionDatas;
      var csData=this.$refs.liandong.$refs.provinceId[0].optionDatas;
      var qxData=this.$refs.liandong.$refs.cityId[0].optionDatas;
      for (var j = 0; j < sfData.length; j++) {
        if (sfData[j].provinceId == this.newformField.provinceId) {
          this.newformField.provinceName=sfData[j].provinceName
        }
      }
      for (var j = 0; j < csData.length; j++) {
        if (csData[j].cityId == this.newformField.cityId) {
          this.newformField.cityName=csData[j].cityName
        }
      }
      for (var j = 0; j < qxData.length; j++) {
        if (qxData[j].countyId == this.newformField.countyId) {
          this.newformField.countyName=qxData[j].countyName
        }
      }
      let vaild = true;
      let reg1 = this.$crmcf.crmRegExp("telOrphone");
      let reg5 = this.$crmcf.crmRegExp("idCard");
      var html = "";
      if (!this.formField.verifywayCode) {
        html = html + `<div class="sys-alertDiv">请选择信息途径</div>`;
      }
      if (!this.newformField.phone) {
        html = html + `<div class="sys-alertDiv">请输入电话</div>`;
      } else {
        if (!reg1.test(this.newformField.phone)) {
          html = html + `<div class="sys-alertDiv">电话（手机或座机号码）格式不正确</div>`;
        }
      }
      if (!this.newformField.credTypeCode) {
        html = html + `<div class="sys-alertDiv">请选择证件类型</div>`;
      } else {
        if (this.newformField.credTypeCode == "1") {
          if (this.newformField.credNo) {
            if (!reg5.test(that.newformField.credNo)) {
              html = html + `<div class="sys-alertDiv">证件号码格式不正确</div>`;
            }
          }
        }
      }
      if (!this.newformField.credNo) {
        html = html + `<div>请输入证件号码</div>`;
      }
      if (!this.newformField.provinceId) {
        html = html + `<div class="sys-alertDiv">请选择省份</div>`;
      }
      if (!this.newformField.cityId) {
        html = html + `<div class="sys-alertDiv">请选择城市</div>`;
      }
      if (!this.newformField.countyId) {
        html = html + `<div class="sys-alertDiv">请选择区县</div>`;
      }
      if (!this.newformField.addrStreet) {
        html = html + `<div class="sys-alertDiv">请输入详细地址</div>`;
      }

      if (html != "") {
       this.$crmcf.showMessages(this, 'error', html, true)
        return;
      }
      //this.$utils.validataMoth(this, "validpopup");
      if (vaild) {
        this.saveForm();
      }
    },
    saveForm() {
      //保存表单
      let verifywayCode = this.formField.verifywayCode;
      this.params.dlrCustNo = this.formField.dlrCustNo;
      this.params.custClassCode = this.formField.custClassCode;
      this.params.phone = this.newformField.phone;
      this.params.credTypeCode = this.newformField.credTypeCode;
      this.params.credNo = this.newformField.credNo;
      this.params.provinceId = this.newformField.provinceId;
      this.params.cityId = this.newformField.cityId;
      this.params.countyId = this.newformField.countyId;
      this.params.addrProvince = this.newformField.provinceName;
      this.params.addrCity = this.newformField.cityName;
      this.params.addrCounty = this.newformField.countyName;
      this.params.addrStreet = this.newformField.addrStreet;
      this.params.custFullName = this.formField.custFullName;
      this.params.custName = this.formField.custName;
      this.params.custFullName =
        this.formField.custFullName == undefined
          ? this.formField.custName
          : this.formField.custFullName;

      let queryObj = {
        // 保存mutation
        type: "mutation",
        // api配置
        apiConfig: this.apiConfig,
        // 条件/实体参数（变量），根据typeParam中的定义配置
        variables: {
          // 当前中台使用的名称有dataInfo、info，具体查看API文档
          dataInfo: {
            carInfo: {
              vin: this.formField.vin,
              carBrandCode: this.formField.carBrandCode
            },
            custInfo: this.params,
            verifywayCode: this.formField.verifywayCode
          }
        }
      };
      // 转换了中台请求格式数据
      var paramD = this.$getParams(queryObj);
      // 调用中台API方法（可复用）
      this.$requestAPI(paramD).then(response => {
        if (response.data[queryObj.apiConfig.ServiceCode].result === "1") {
          // 保存成功
          this.sendCode("1");
          this.$message({
            message: "保存成功",
            type: "success",
            uration: 2000
          });
          // this.$parent.editPopupsVisible = false;
          this.curPopupsVisible = false;
          this.$parent.$refs.multipleTable.queryTable();
        } else {
          // 保存失败
          //this.sendCode("0");
          this.$message({
            message:
              "保存失败：" + response.data[queryObj.apiConfig.ServiceCode].msg,
            type: "warn",
            uration: 2000
          });
        }
      });
    },

    //
    prochange(val) {
      let that = this;
      that.City.pcode = val;
      if (that.$refs.city == undefined) {
      } else {
        that.$refs.city.getData();
      }
    },
    citychange(val) {
      let that = this;
      that.District.pcode = val;
      if (that.$refs.district == undefined) {
      } else {
        that.$refs.district.getData();
      }
    },
    close() {
      this.$parent.curPopupsVisible = false;
    }
  }
};
</script>
